<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

	<head lang="en">
		<meta charset="UTF-8">
		<title>优客书城数据页</title>
	</head>
	<body>
		<div class="row">
			<div class="container">
				<div class="col-sm-6 col-md-3" th:each="book:${bookList}">
					<div class="thumbnail">
						<a href="details.html" th:href="@{/book/detail(id=${book.id})}"><img src="images/beiwei78.jpg" th:src="@{'/images/book/' + ${book.imgUrl}}" alt="通用的占位符缩略图"></a>
						<div class="caption">
							<h3 th:classappend="h3-height" th:text="${book.name}">北纬78°</h3>
							<p th:classappend="p-height">价格:<span th:text="${book.newPrice}">19.5</span>元&nbsp;&nbsp;作者:<span th:text="${book.author}">陈丹燕</span>&nbsp;&nbsp;</p>
							<p>
								<a href="details.html" th:href="@{/book/detail(id=${book.id})}">
									更多信息
								</a>
							</p>
						</div>
					</div>
				</div>
			</div>

			<!--分页-->
			<div class="container">
				<ul class="pager">
					<li th:classappend="${cur == 1} ? 'disabled' : ''">
						<a th:style="${cur == 1} ? 'pointer-events:none' : ''" href="javascript:void(0)" th:onclick="|loadData(${pre},${category})|">&larr;上一页</a>
					</li>
					<li th:classappend="${cur == last} ? 'disabled' : ''" >
						<a th:style="${cur == last}  ? 'pointer-events:none' : ''" href="javascript:void(0)" th:onclick="|loadData(${next},${category})|">下一页 &rarr;</a>
					</li>

				</ul>
			</div>
		</div>
	</body>

</html>